<template>
	<view class="pay-detail">
		<image :src="detail.fristPageUrl" class="bimg" mode=""></image>
		<view class="cont-info">
			<view class="cont">
				<view class="name-txt">
					<view class="l">商品名：</view>
					<view class="c">
						{{detail.describ}}
					</view>
				</view>
				<view class="pric">
					费用：<text class="pr" v-if="!isPay">¥{{(Number(detail.unitPrice) * Number(orderElementPicLen)).toFixed(1) }}</text>
					<text class="pr" v-else>¥{{detail.price}}</text>
				</view>
				<view class="pay-type">
					选择支付方式
					<view class="p-item">
						<image src="../../static/wx.png" class="wx" mode=""></image>
						<view class="p-r">
							微信支付
							<view class="desc">推荐已安装微信客户端使用</view>
						</view>
						<image src="../../static/check-pay.png" class="check-pay" mode=""></image>
					</view>
				</view>
			</view>
			<view class="p-hr"></view>
			 <!-- @tap="goUrl('/pagesB/pay/payment')" -->
			<view class="p-bnt" @tap="goPayOrder" v-if="isPay">
				继续付款
			</view>
			<view class="p-bnt" @tap="goPay" v-else>
				{{ isPayOrder ? '继续付款' : '确认支付'}}
			</view>
		</view>
	</view>
</template>

<script>
	import {getGoodsInfo,printCreateOrder,nailPayOrder} from '@/api/goods.js'
	// import {getShowDetail} from "@/api/buyer.js"
	import {getQuerySubjectInfo} from "@/api/user.js"
	export default {
		data() {
			return {
				detail: {
					orderElementPic: []
				},
				def: {},
				num: 1,
				payOrderId: '',
				isPay: false,
				orderElementPicLen: 0,
				diyUrl: '',
				isPayOrder: false
			};
		},
		onLoad(ops) {
			if(ops.payType == 1001) {
				this.isPay = true
				let data = uni.getStorageSync('payInfo') || {}
				this.detail.fristPageUrl = data.subjectRenderingPic
				this.detail.describ = data.subjectTitle
				this.detail.price = data.payAmount
			}else{
				let info = !ops.payType ? JSON.parse(decodeURIComponent(ops.info)) : ops;
				console.log('info-----', info);
				this.def = info
				if(info.payType == 11) {
					this.getInfo(info)
				}else{
					this.getPrint()
				}
			}
			this.orderElementPicLen = uni.getStorageSync('orderElementPicLen')
			this.diyUrl = uni.getStorageSync('diyUrlList') || []
		},
		methods:{
			goUrl(url){
				uni.navigateTo({
					url
				})
			},
			getInfo(ops) {
				getQuerySubjectInfo({id:this.def.id}).then((res) => {
					let data = res
					let ids = []
					data.elementsImagesList.forEach((c) => {
						ids.push(c.id)
					})
					this.detail = res
					this.detail.orderElementPic = ids
				})
			},
			getPrint() {
				let data = uni.getStorageSync('payPrintObj') || ''
				console.log('------data-------',data)
				this.detail = data
				this.def = data
				// getShowDetail({id:this.def.id}).then((res) => {
				// 	this.detail = res
				// })
			},
			goPay(){
				let merchantId = uni.getStorageSync('merchantId')
				const that = this
				const payOrder = () => {
					// 支付订单获取微信所需参数
					let params = {
						orderId: this.payOrderId,//this.detail.id,
						orderType: 1,
						payAmount: parseFloat((this.orderElementPicLen * this.detail.unitPrice).toFixed(10)) * 100,
						paymentType: 1,
						orderDesc: this.detail.describ,
						tenantId:merchantId
					}
					nailPayOrder(params).then((res) => {
						console.log(res,'支付订单~~~~')
						//调起微信支付请求
						console.log(res,'09',res.timestamp)
						wx.requestPayment({
							"timeStamp":""+res.timeStamp+"",
							"nonceStr":res.nonceStr,
							"package": res.package,
							"signType": res.signType,
							"paySign": res.paySign,
							success:function(resp){
								console.log('success:' + JSON.stringify(resp));
								uni.showToast({
								   title: '支付成功',
								   icon: 'none',
								   duration: 2000
								});
								that.isPayOrder = false
								uni.redirectTo({
									// url: '/pagesB/pay/payment?payAmount='+ (params.payAmount / 100) + '&type=1''
									url: '/pagesA/gallery/galleryDetail?type=2&id=' + that.def.id
								})
							},
							fail:function(resp){
								console.log('fail:' + JSON.stringify(resp));
								uni.showToast({
								   title: '支付失败',
								   icon: 'none'
								});
								that.isPayOrder = true
							}
						})
					})
				}
				// 是否创建订单
				if(!this.isPayOrder){
					console.log('未创建~',this.detail)
					let order = {
						orderElementPic: this.detail.orderElementPic.join(','),
						orderOrigin: this.def.orderOrigin,
						// payAmount: (this.detail.orderElementPic.length * this.detail.unitPrice)  * 100,
						payAmount: parseFloat((this.orderElementPicLen * this.detail.unitPrice).toFixed(10)) * 100,
						paymentType: 1,
						printCount: this.orderElementPicLen,
						showId: this.def.orderOrigin ==1 ? '' : this.def.showId,
						subjectId: this.def.subjectId,
						diyUrl: this.diyUrl.join(','),
						tenantId:merchantId
					}
					console.log('创建订单参数',order)
					// 创建订单
					printCreateOrder(order).then((res) => {
						console.log(res,'创建订单')
						this.payOrderId = res.id
						payOrder()
					})
				}else{
					console.log('已创建~')
					payOrder()
				}
			},
			
			// 再次支付
			goPayOrder(){
				let merchantId = uni.getStorageSync('merchantId')
				let data = uni.getStorageSync('payInfo') || {}
				const that = this
				// 支付订单获取微信所需参数
				let params = {
					orderId: data.id,
					orderType: 1,
					payAmount: data.payAmount * 100,
					paymentType: 1,
					orderDesc: data.subjectTitle,
					tenantId:merchantId
				}
				uni.showLoading({
				    title: '支付中...'
				});
				nailPayOrder(params).then((res) => {
					console.log(res,'支付订单~~~~')
					//调起微信支付请求
					console.log(res,'09',res.timestamp)
					uni.hideLoading()
					wx.requestPayment({
						"timeStamp":""+res.timeStamp+"",
						"nonceStr":res.nonceStr,
						"package": res.package,
						"signType": res.signType,
						"paySign": res.paySign,
						success:function(resp){
							console.log('success:' + JSON.stringify(resp));
							uni.showToast({
							   title: '支付成功',
							   icon: 'none',
							   duration: 2000
							});
							uni.redirectTo({
								// url: '/pagesB/pay/payment?payAmount='+ (params.payAmount / 100) + '&type=1'
								url: '/pagesA/gallery/galleryDetail?type=2&id=' + that.def.id
							})
						},
						fail:function(resp){
							console.log('fail:' + JSON.stringify(resp));
							uni.showToast({
							   title: '支付失败',
							   icon: 'none'
							});
						}
					})
				})
			}
		}
	}
</script>

<style lang="less" scoped>
.pay-detail{
	.bimg{
		width: 750rpx;
		height: 560rpx;
	}
	.cont-info{
		position: absolute;
		left: 0px;
		top: 504rpx;
		// bottom: 0;
		width: 750rpx;
		height: 944rpx;
		border-radius: 40rpx 40rpx 0px 0px;
		background: linear-gradient(180deg, #FFFFFF 4%, rgba(246,241,235,0.00) 100%);
		box-shadow: 0px 8rpx 20rpx 0px rgba(228, 73, 91, 0.05);
		
		.cont{
			font-size: 36rpx;
			margin: 0 32rpx;
			margin-top: 32rpx;
		}
		.name-txt{
			display: flex;
			.l{
				width: 144rpx;
			}
			.c{
				flex: 1;
				font-size: 32rpx;
			}
		}
		.pric{
			margin-top: 16rpx;
			.pr{
				color: #E4919D;
			}
		}
		.pay-type{
			font-size: 32rpx;
			color: #666;
			margin-top: 78rpx;
			.p-item{
				display: flex;
				align-items: center;
				margin-top: 48rpx;
				.wx{
					width: 88rpx;
					height: 88rpx;
					vertical-align: middle;
				}
				.check-pay{
					width: 48rpx;
					height: 48rpx;
				}
				.p-r{
					font-size: 32rpx;
					color: #333333;
					flex: 1;
					margin-left: 6rpx;
					.desc{
						font-size: 24rpx;
						color: #666;
					}
				}
			}
		}
		.p-hr{
			height: 1rpx;
			background-color: #e0e5e5;
			margin: 0 32rpx;
			margin-top: 24rpx;
		}
		.p-bnt{
			height: 98rpx;
			line-height: 98rpx;
			text-align: center;
			border-radius: 50rpx;
			background: #E4919D;
			color: #FFFFFF;
			font-size: 36rpx;
			margin: 0 32rpx;
			margin-top: 163rpx;
		}
	}
}
</style>
